<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<style>
	div{
		border:1px solid red;
		width:100px;
		height:100px;
	}
	/*
		给4个边设置相同的边距
	*/
	#d1{
		padding:20px;
		margin:40px;
	}
	/*
		给四个边距设置不同的边距
		顺序是上右下左
	*/
	#d2{
		padding:10px 20px 30px 40px;
		margin:10px 20px 30px 40px;
		
	}
	/*
		给单个边设置边距
		left/right/top/bottom
		
	*/
	#d3{
		padding-left:20px;
		margin-bottom:30px;
		
	}
	/*
		对称设置边距
		第一个值是上下,第二个值是左右
		
	*/
	#d4{
		padding:20px 40px;
		margin:30px 50px;
	
	
	}
	/*
		对称设置外边距的特列:
		当左右为auto时,元素会水平居中
	*/
	#d5{
		margin:20px auto;
	}
</style>
</head>
<body>
	<div id="d0">d0</div>
	<div id="d1">d1</div>
	<div id="d2">d2</div>
	<div id="d3">d3</div>
	<div id="d4">d4</div>
	<div id="d5">d5</div>
	<div id="d6">d6</div>
</body>
</html>